/**
 * 岗位选择器(会有重复dutyCode，所以使用recruitCode)
 */
import React from 'react';
import { Select, Spin } from 'antd';
import { useRequest } from '@/hooks';
import { fetchPostExtra } from '../../service';

function Post({ user, value, onChange, ...props }) {
    const { loading, data: sourceData = [] } = useRequest(() => fetchPostExtra(), {
        formatResult: data => (Array.isArray(data.data) ? data.data : []),
        cacheKey: 'postList'
    });

    return (
        <Spin spinning={loading}>
            <Select
                style={{ width: 170 }}
                dropdownMatchSelectWidth={false}
                optionLabelProp="label"
                placeholder="请选择"
                showSearch
                optionFilterProp="children"
                allowClear
                getPopupContainer={triggerNode => triggerNode.parentElement}
                value={value}
                onChange={(_value, option) => {
                    onChange(_value, option);
                }}
                {...props}
            >
                {sourceData.map(item => (
                    <Select.Option key={item.recruitCode} options={item} label={item.dutyName}>
                        <span style={{ color: '#ccc' }}>
                            {item.companyName}-{item.organizationName}
                        </span>
                        -{item.dutyName}
                    </Select.Option>
                ))}
            </Select>
        </Spin>
    );
}

export default Post;
